导航菜单
首页 >  尝试 Fluent Editor  > 快速开始

快速开始

快速开始 ​

安装 Fluent Editor:

shellnpm i @opentiny/fluent-editor

编写 html:

html Hello Fluent Editor!

引入样式:

css@import '@opentiny/fluent-editor/style.css';

初始化 Fluent Editor 编辑器:

javascriptimport FluentEditor from '@opentiny/fluent-editor'// 执行初始化时,请确保能获取到 DOM 元素,如果是在 Vue 项目中,需要在 onMounted 事件中执行。const editor = new FluentEditor('#editor', { theme: 'snow',})通过 CDN 方式使用 ​

你也可以通过 CDN 方式使用 Fluent Editor,只需要在 HTML 文件中增加以下内容:

html{ "imports": {"@opentiny/fluent-editor": "https://unpkg.com/@opentiny/fluent-editor@3.18.3/index.es.js" }}

接着就可以导入 Fluent Editor,并通过 new FluentEditor(selector, options) 进行初始化。

html// 引入 @opentiny/fluent-editorimport FluentEditor from '@opentiny/fluent-editor'// 初始化 Fluent Editor 富文本编辑器const editor = new FluentEditor('#editor', { theme: 'snow',})

相关推荐: